Javascript Functional Programming Features — Closures and Functions

JavaScript is an easy to learn programming language. It also uses lots of functional programming features that make our lives easier.

In this article, we’ll look at some functional programming features that are related to functions.

Closure

A closure is a function that’s inside a function that can access the items of the outer function.

It’s used to hide items from the outside while letting the inner function access the items in the outside function.

In JavaScript, closures are created every time a function is created at function creation time.

An example of a closure is the following:

const foo = () => {
  let x = 1;
  return () => x;
}

In the code above, we have the foo function which has the variable x defined inside. It also returns a function that returns x defined within foo itself.

This is what closures are good for. They let us access items from the outside from within the inner function.

Statelessness

Stateless programming is a paradigm where operations that we implement aren’t sensitive to the state of the computation. This means that all data used in an operation are passed as inputs of the operation.

And data used by whatever operations invoked that operation is passed back as outputs.

For instance, pure functions don’t change the state of the environment. If we have a function like:

const add = (a, b) => a + b;

It doesn’t change the state of the environment since it’ just takes the arguments that are passed in and then returns a value.

Statelessness goes hand in hand with pure functions since they don’t commit side effects, and side effects are designed to change the state of the program.

Composition

The composition is the combination of operations that let us break down our problems into small pieces.

With each small piece, we can build our solution to the bigger problem. We can solve small problems easily, but we can’t solve big problems all at once.

For instance, if we have pure functions, then they are composed. For instance, we can call the add function we have above repeated to get the total that we want to get for example.

With the add , function, we can compose it as follows:

const result = add(add(1, 2), 3);

In the code above, we first call add(1, 2) to get 3, then with that we call add(3, 3) to get 6 after the 3 is returned.

Any pure function can be composed easily since they’re stateless and don’t commit any side effects.

Other operations like arithmetic operations, boolean operations, are all composable since we can invoke them one after the other add they all return a new value instead of mutating the existing value.

Curry

Currying is the process of taking a function with multiple arguments and turning it into a series of functions each with only one argument.

For instance, we can create a multiplication function that each takes 3 numbers and then after calling it 3 times with one argument, returns the product of 3 numbers.

We can write the following to get that:

const curryMultiply = x => y => z => x * y * z;
const result = curryMultiply(1)(2)(3);

Then we get 6 since we first called it with 1, returns a function that returns a function to multiply 1 by y and z .

Then we call that returned function with 2, which returns a function that has the parameter z and then multiplies 1 by 2 and z .

Finally, we called that function with 3 so that we get the final product, which is 6.

Lambda

Lambda expressions are expressions that creates functions. In JavaScript, we have lambdas since functions are first-class. They’re treated like any other object within a program.

Lambdas in JavaScript are traditional or arrow anonymous or named functions that are used as parameters within a function as an array instance’s map method.

For instance, the following piece of code has a lambda function:

const arr = [1, 2, 3].map(a => a * 3);

In the code above, a => a * 3 is the lambda function. Lambdas can also be named functions, for instance, we can write:

const arr = [1, 2, 3].map(function triple(a) {
  return a * 3;
});

The triple function in the code above is a lambda function.

Conclusion

Closures let inner functions access the scope of the outer function. It’s useful for encapsulating data within a function.

Currying converts a function from multiple arguments to multiple functions that take one argument each.

Function composition is invoking multiple operations that can be combined to do one complex operation.

Statelessness is the avoidance of changing state. This makes composition easy.

Lambdas are functions that are passed in as parameters. They’re often used for callbacks.